import Base from '@/components/Base';
import {
  Button,
  Card,
  Form,
  Radio,
  Input,
  Badge,
  Select,
  Table,
  Modal,
  message,
  Popover,
} from 'antd';
import { KayButton, View, Text } from '@/components/KayUI';
import styles from './index.less';

import { useContext, useReducer } from 'react';
import { ReducerTest, TextType, TextTypeAction, initData } from '../../reducer';
import { TestContext } from '../../context';
import { RcStatesContext, RcDispatchContext } from '../../reducerContext';

export const TestCompB = () => {
  const [data, dispatch] = useReducer(ReducerTest, initData);
  return (
    <div>
      <h2>CompB</h2>
      {data.map((e) => (
        <View>
          <Text>
            name: {e.name}; val: {e.value}
          </Text>
        </View>
      ))}
      <Button
        onClick={() => {
          dispatch({
            type: 'add',
            value: {
              name: '???',
              value: '!!!',
            },
          });
        }}
      >
        add
      </Button>
      <Button
        onClick={() => {
          dispatch({
            type: 'edit',
            value: {
              name: '***',
              value: '&&&',
            },
          });
        }}
      >
        edit
      </Button>
    </div>
  );
};

export const TestCompC = () => {
  const testContext = useContext(TestContext);
  const rcData = useContext(RcStatesContext);
  const rcDataDispatch = useContext(RcDispatchContext);
  return (
    <div>
      <h2>CompC</h2>
      <h5>{'level: ' + testContext.level}</h5>
      <View
        style={{
          border: '1px solid #f30',
        }}
      >
        {rcData.map((e) => (
          <Text>
            {e.name}---{e.desc}
          </Text>
        ))}
      </View>
    </div>
  );
};
